<!DOCTYPE html>
<html lang="zh_CN" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head th:fragment="head">
	<base th:href="@{/}">
	<meta charset="utf-8">
	<title>新增</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">
	<link rel="stylesheet" href="static/layui/css/layui.css" media="all" />
	<script type="text/javascript" src="static/layui/layui.js"></script>
	<script type="text/javascript" src="/static/plugin/jquery/jquery-3.2.1.min.js"></script>
	<style type="text/css">
		.layui-form-label {
			white-space: nowrap;
			width: 120px;
			color: gray;
		}
	</style>
</head>
<body>
<div class="layui-fluid">
	<div class="layui-card">
		<!-- 内容区 -->
		<div class="layui-card-body">
			<form class="layui-form" id="form" action="" lay-filter="demo-val-filter">
				<div class="layui-form-item" style="margin-top: 20px;">
					<div class="layui-inline">
						<label class="layui-form-label">订单工序</label>
						<div class="layui-input-inline">
							<input name="orderProcess" id="orderProcess" class="layui-input" lay-verify="required" disabled>
							<input name="id" style="display: none">
						</div>
					</div>
					<div class="layui-inline">
						<label class="layui-form-label">工序名称</label>
						<div class="layui-input-inline">
							<input name="orderProcessName" class="layui-input" lay-verify="required" disabled>
						</div>
					</div>
					<div class="layui-inline">
						<label class="layui-form-label">含税单价</label>
						<div class="layui-input-inline">
							<input type="number" name="ioritaxcost" class="layui-input" lay-verify="required">
						</div>
					</div>
				</div>
				<div class="layui-form-item" style="margin-top: 20px;">
					<div class="layui-inline">
						<label class="layui-form-label">计价方式</label>
						<div class="layui-input-inline">
							<select name="pricingMethod" lay-verify="required" lay-filter="demo-select-filter">
								<option value="计件">计件</option>
								<option value="计时">计时</option>
								<option value="按批">按批</option>
							</select>
						</div>
					</div>
					<div class="layui-inline">
						<label class="layui-form-label">标准工时</label>
						<div class="layui-input-inline">
							<input type="number" name="expectHours" id="expectHours" min="0" class="layui-input" lay-verify="required" >
						</div>
					</div>
					<div class="layui-inline">
						<label class="layui-form-label"></label>
						<button type="submit" style="display: none" id="submit" class="layui-btn" lay-submit lay-filter="demo1">立即提交</button>
						<button type="reset" class="layui-btn layui-btn-primary">重置</button>
					</div>
				</div>
			</form>
		</div>
	</div>
	<script type="text/javascript" src="/static/layui/module/tableSelect.js"></script>
	<script type="text/javascript" th:inline="javascript">
		let proId = [[${id}]]
		let sign = false;
		layui.use(['layer','jquery','table','element','form','laydate','tableSelect'],function(){
			let layer = layui.layer,
					table = layui.table,
					form = layui.form,
					laydate = layui.laydate,
					$ = layui.jquery,
					tableSelect = layui.tableSelect,
					element = layui.element;

			//获取form填充数据
			$.get('/manage/common/info/sale_order_process/'+proId,function (d) {
				form.val('demo-val-filter', d);
			})

			tableSelect.render({
				elem: '#orderProcess',
				searchKey: 'key',
				searchPlaceholder: '工序编码',
				checkedKey: 'code',
				table: {
					url: '/manage/process/listType'
					,method: 'post'
					,cols: [
						[
							{ type: 'radio' },
							{ field: 'code', title: '工序编码' },
							{ field: 'name', title: '工序名称' },
						]
					]
				},
				done: function (elem, data) {
					let da = data.data[0]
					elem.val(da.code)
					$('input[name=orderProcessName]').val(da.name)
				}
			})

			form.on('submit(demo1)', function(data){
				sign = true
				return false; // 阻止默认 form 跳转
			});

			form.on('select(demo-select-filter)', function(data){
				let value = data.value; // 获得被选中的值
				if (value === '计件'){
					$('#expectHours').removeAttr("lay-verify");
					form.render();
				}else {
					$('#expectHours').attr("lay-verify","required")
					form.render();
				}

			});

		})

		function getFormDataAndValidate() {

			$('#submit').click();

			let data = layui.form.val('demo-val-filter');
			if (!data.expectHours){
				data.expectHours = 0
			}
			data.sign = sign
			return data
		}
	</script>
</div>
</body>
</html>